<template>
    <div class="main">

    <div>
    <van-divider><h2>请登录</h2></van-divider>

    <van-form @submit="onSubmit">
  <van-field
    v-model="phone"
    label="手机号："
    placeholder="手机号"
    :rules="[{ required: true, message: '请填写手机号' },{pattern:/^1[356789]\d{9}$/, message: '手机号格式错误' }]"
  />
  <van-field
    v-model="password"
    type="password"
    label="密码"
    placeholder="请输入密码"
    :rules="[{ required: true, message: '请填写密码' }]"
  />
  <div style="margin: 16px;">
    <van-button round block type="info" native-type="submit">提交</van-button>
  </div>
</van-form>
    <div class="d1">
    <a href="#" @click.prevent="test()">手机验证码登录</a>
    <a href="#" @click.prevent="register()">没有账号？去注册</a>
    </div>
    </div>
    </div>
</template>
<script>
import { Toast } from 'mint-ui';
import { Indicator } from 'mint-ui';
import url from "../tools/url"
export default {
    name:"my_home",
    data() {
        return {
          selected:"登录页",
          phone:null,
          password:null,
        }
    },
    methods: {
        onSubmit(){
           Indicator.open({
            text: 'Loading...',
            spinnerType: 'fading-circle'
});
        var str=`phone=${this.phone}&password=${this.password}`;
        this.axios.post(url.GETPASSWORD,str).then((pro)=>{
           if(pro.data.code==200){
            sessionStorage.setItem("token",pro.data.data.token);
          //  sessionStorage.setItem("data",pro.data.data.data);
            this.$store.commit("user_info",pro.data.data)
            this.$router.push("/page").catch(e=>{})
            Indicator.close();
           }else{
            Indicator.close();
            Toast('错误');
           }
        })
        },
        register(){
            this.$router.push("/register").catch(e=>{})
        },
        test(){
            this.$router.push("/test").catch(e=>{})
        }
    },
    mounted() {
        
        // this.is=sessionStorage.getItem("is");
    },
    
}
</script>
<style scoped>
.main{
    text-align: center;
}
.d1{
    width: 90%;
    margin-left: 5%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
a{
    text-decoration: none;
    color: rgb(154, 139, 139);
}
</style>